import QtQuick 1.0
import "../Components/"

DialogBase {
    id: _root
    width: calcWidth(_tab)
    height: calcHeight()
    x: 0
    y: 0

    dialogTitle: "Setting"

    signal clickOkButton        //OKボタンのイベント
    signal clickCancelButton    //cancelボタンのイベント

    // 表示された時の処理
    function viewEvent(){
        loadSetting();
        _root.forceActiveFocus();
    }

    // 設定を反映する
    function applySetting(){
        // 一般
        _Setting.updateInterval = _intervalText.value;
        _Setting.updateCount = _updateCountText.value;
        _Setting.viewCountMax = _viewCountText.value;
        _Setting.inReplyCountMax = _inReplyToCountMaxText.value;
        _Setting.toFocusTweetButton = _toFocusTweetButtonText.checked;
        // 画像
        switch(_iconSize.currentIndex){
        case 0:
            _Setting.iconSize = 24;
           break;
        case 1:
            _Setting.iconSize = 36;
            break;
        default:
            _Setting.iconSize = 48;
            break;
        }
        // 表示アイテム
        _Setting.fontPixelSizeTitle = _titleFontSize.value;
        _Setting.fontPixelSizeMessage = _messageFontSize.value;
        _Setting.fontPixelSizeInfomation = _informationFontSize.value;
        _Setting.fontPixelSizeInputBox = _tweetInputFontSize.value;
    }

    // 設定を読み込む
    function loadSetting(){
        // 一般
        _intervalText.value = parseInt(_Setting.updateInterval).toString();
        _updateCountText.value = parseInt(_Setting.updateCount).toString();
        _viewCountText.value = parseInt(_Setting.viewCountMax).toString();
        _inReplyToCountMaxText.value = parseInt(_Setting.inReplyCountMax).toString();
        _toFocusTweetButtonText.checked = _Setting.toFocusTweetButton;
        // 画像
        switch(_Setting.iconSize){
        case 24:
           _iconSize.currentIndex = 0;
           break;
        case 36:
            _iconSize.currentIndex = 1;
            break;
        default:
            _iconSize.currentIndex = 2;
            break;
        }
        // 表示アイテム
        _titleFontSize.value = _Setting.fontPixelSizeTitle;
        _messageFontSize.value = _Setting.fontPixelSizeMessage;
        _informationFontSize.value = _Setting.fontPixelSizeInfomation;
        _tweetInputFontSize.value = _Setting.fontPixelSizeInputBox;
    }

    // パラメータチェック
    function checkValues(){
        var ret = true;

        return ret;
    }


    // 幅の計算
    function calcWidth(obj){
        var max_width = 0;
        for(var i=0; i<obj.children.length; i++){
            if(max_width < obj.children[i].width){
                max_width = obj.children[i].width;
            }
        }
        max_width += 20;
        // windowより大きかったら
        if(max_width > _root.parent.width){
            max_width = _root.parent.width - _root.border.width * 2;
        }
        return max_width;
    }
    // 高さの計算
    function calcHeight(){
        var temp_height = titleHeight
            + _tab.height + _tab.anchors.topMargin + _tab.anchors.bottomMargin
            + _areaButton.height + _areaButton.anchors.topMargin + _areaButton.anchors.bottomMargin;
        if(temp_height > _root.parent.height){
            temp_height = _root.parent.height - _root.border.width * 2;
        }
        return temp_height;
    }
    // 前のタブの状態
    function getPrevTab(){
        var ret = "";
        switch(_root.state){
        case "State1":
            ret = "";
            break;
        case "State2":
            ret = "State1";
            break;
        default:
            ret = "";
            break;
        }
        return ret;
    }
    // 次のタブの状態
    function getNextTab(){
        var ret = "";
        switch(_root.state){
        case "State1":
            ret = "State2";
            break;
        case "State2":
            ret = "State2";
            break;
        default:
            ret = "State1";
            break;
        }
        return ret;
    }

    Keys.onEscapePressed: {
        clickCancelButton();
    }

    // タブ移動のボタン
    Row{
        anchors.top: parent.titleBottom
        anchors.topMargin: 15
        anchors.right: parent.right
        anchors.rightMargin: 15
        spacing: 5

        Button{
            text: "  <  "
            font.pixelSize: _Setting.fontPixelSizeButton * _root.density
            onClicked: {
                _root.state = _root.getPrevTab();
            }
        }
        Button{
            text: "  >  "
            font.pixelSize: _Setting.fontPixelSizeButton * _root.density
            onClicked: {
                _root.state = _root.getNextTab();


            }
        }

    }


    // 内容
    Row{
        id: _tab
        anchors.top: parent.titleBottom
        anchors.topMargin: 10
        x: 10

        // 一般設定
        Column{
            id: _tab0
            width: calcWidth(_tab0)//_root.width - 20
            spacing: 10


            // タイトル
            Text {
                text: qsTr("General")
                color: "#ffffff"
                font.pixelSize: _Setting.fontPixelSizeDlgMessageM * _root.density
                font.bold: true
                font.underline: true
            }

            // 更新間隔
            Text {
                text: qsTr("Update interval(sec) : ")
                font.pixelSize: _Setting.fontPixelSizeDlgMessageS * _root.density
                color: "#ffffff"
            }
            NumberBox{
                id: _intervalText
                anchors.leftMargin: 20
                value: 60
                min: 30
                max: 300
                step: 30
                accelerate: false
                density: _root.density
            }

            // 取得件数
            Text {
                text: qsTr("Get tweets(20-200) : ")
                color: "#ffffff"
                font.pixelSize: _Setting.fontPixelSizeDlgMessageS * _root.density
            }
            NumberBox{
                id: _updateCountText
                value: 30
                min: 20
                max: 200
                step: 10
                accelerate: false
                density: _root.density
            }

            // 最大表示件数
            Text {
                text: qsTr("View tweets(100-) : ")
                color: "#ffffff"
                font.pixelSize: _Setting.fontPixelSizeDlgMessageS * _root.density
            }
            NumberBox{
                id: _viewCountText
                value: 100
                min: 100
                max: 10000
                step: 100
                accelerate: false
                density: _root.density
            }

            // in reply to の取得回数
            Text {
                text: qsTr("Max to get \'in reply to\'(times) : ")
                color: "#ffffff"
                font.pixelSize: _Setting.fontPixelSizeDlgMessageS * _root.density
            }
            NumberBox{
                id: _inReplyToCountMaxText
                value: 5
                min: 1
                max: 20
                step: 1
                accelerate: false
                density: _root.density
            }

            // ツイートボタンをフォーカス移動するか
            CheckBox {
                id: _toFocusTweetButtonText
                fontPixelSize: _Setting.fontPixelSizeDlgMessageM * _root.density

                text: qsTr("To focus the tweet button")
                color: "#ffffff"
            }
        }

        Column{
            id: _tab1
            width: _tab0.width // calcWidth(_tab1)
            spacing: 10

            // タイトル
            Text {
                text: qsTr("Image")
                color: "#ffffff"
                font.pixelSize: _Setting.fontPixelSizeDlgMessageM * _root.density
                font.bold: true
                font.underline: true
            }

            // アイコンサイズ
            Text {
                text: qsTr("Icon size : ")
                color: "#ffffff"
                font.pixelSize: _Setting.fontPixelSizeDlgMessageS * _root.density
            }
            RadioBox {
                id: _iconSize
                currentIndex: 1
                model: _iconSizeModel
                fontColor: "#ffffff"
                density: _root.density

            }
            ListModel {
                id: _iconSizeModel
                ListElement {
                    _key: 0
                    _text: "Small(24x24)"
                }
                ListElement {
                    _key: 1
                    _text: "Medium(36x36)"
                }
                ListElement {
                    _key: 2
                    _text: "Large(48x48)"
                }
            }
        }

        // 表示アイテムの設定
        Column{
            id: _tab2
            width: _tab0.width // calcWidth(_tab2)//_root.width - 20
            spacing: 10

            // タイトル
            Text {
                text: qsTr("Font size")
                color: "#ffffff"
                font.pixelSize: _Setting.fontPixelSizeDlgMessageM * _root.density
                font.bold: true
                font.underline: true
            }

            // タイトルのサイズ
            Text {
                text: qsTr("Name : ")
                color: "#ffffff"
                font.pixelSize: _Setting.fontPixelSizeDlgMessageS * _root.density
            }
            NumberBox{
                id: _titleFontSize
                value: 10
                min: 6
                max: 48
                step: 1
                accelerate: false
                density: _root.density
            }

            // メッセージのサイズ
            Text {
                text: qsTr("Tweet : ")
                color: "#ffffff"
                font.pixelSize: _Setting.fontPixelSizeDlgMessageS * _root.density
            }
            NumberBox{
                id: _messageFontSize
                value: 12
                min: 6
                max: 48
                step: 1
                accelerate: false
                density: _root.density
            }

            // 情報のサイズ
            Text {
                text: qsTr("Information : ")
                color: "#ffffff"
                font.pixelSize: _Setting.fontPixelSizeDlgMessageS * _root.density
            }
            NumberBox{
                id: _informationFontSize
                value: 8
                min: 6
                max: 48
                step: 1
                accelerate: false
                density: _root.density
            }

            // 入力ボックス
            Text {
                text: qsTr("Tweet input box : ")
                color: "#ffffff"
                font.pixelSize: _Setting.fontPixelSizeDlgMessageS * _root.density
            }
            NumberBox{
                id: _tweetInputFontSize
                value: 10
                min: 6
                max: 48
                step: 1
                accelerate: false
                density: _root.density
            }
        }
    }



    // OK Cancelボタン
    Row {
        id: _areaButton
        anchors.topMargin: 10
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 10
        anchors.horizontalCenter: parent.horizontalCenter
        spacing: 5
        Button {
            id: _buttonOk
            width: _buttonCancel.width
            text: qsTr("O K")
            font.pixelSize: _Setting.fontPixelSizeButton * _root.density
            onClicked : {
                if(checkValues()){
                    applySetting();
                    clickOkButton();
                }
            }
        }
        Button {
            id: _buttonCancel
            text: qsTr("Cancel")
            font.pixelSize: _Setting.fontPixelSizeButton * _root.density
            onClicked : {
                clickCancelButton();
            }
        }
    }

    // タブの状態
    states: [
        State {
            name: "State1"
            PropertyChanges{ target: _tab; x: (10 - _tab0.width)}
        },
        State {
            name: "State2"
            PropertyChanges{ target: _tab; x: (10 - _tab0.width * 2)}
        }
    ]
    transitions: Transition {
        NumberAnimation {
            easing.type: Easing.OutCubic
            target: _tab
            properties: "x"
            duration: 500
        }
    }

}
